<template>
	<view class="selectProject">
		<!-- 设备出库 --- 选择项目 页面-->
		<navBar title="选择项目" goBackUrl="/subpackage-equipment/pages/device/deviceCome/deviceCome" @goBack="goBack"></navBar>
		
		<scroll-view scroll-y="true" class="scroll-box">
			<view class="content">
				<view class="item" v-for="item in projectList" :key="item.id" @click="getClick(item)">
					<text class="name">{{ item.name }}</text>
					<u-icon name="arrow-right" color="#A7AEBD" size="22"></u-icon>
				</view>
			
			</view>
		</scroll-view>
		
			<basePicker
			:showPicker="showPicker"
			:data="data1"
			:columnData="data2"
			keyName="name"
			:title="title"
			@confirm="confirm"
			@cancel="cancel">
			</basePicker>
	</view>
</template>

<script>
	import basePicker from "@/components/basePicker/basePicker.vue"
	import { getTreeByNameByLike } from "@/api/emergency/polling.js"
	import { mapMutations } from "vuex"
	export default{
		name: "selectProject",
		components: {
			basePicker
		},
		data() {
			return {
				list: [],
				showPicker: false,
				data1: [],
				data2: [],
				title: "",
				projectName: "",
				projectList: [],      // 项目列表
			}
		},
		mounted() {
			this.getTreeByNameByLike()
		},
		methods: {
			...mapMutations('device', ["getProjectName", "getProjectSiteId"]),
			getClick(item){
				console.log(item)
				this.data1 = []
				this.data2 = []
				this.title = item.name
				let list = item.list.map(value=>({name: value.name, id: value.id}))
				this.data1[0] = list
				if(list.length > 0){
					console.log(list,'item.list')
					item.list.forEach((value,index)=>{
						let itemList = value.list.map(val=>({ name: val.name, id: val.id }))
						if(index === 0){
							this.data1.push(itemList)
						}
						this.data2.push(itemList)
					})
				}
				this.showPicker = true
			},
			
			confirm(bool, data){
				// console.log(data.value[1].id,'data')
				if(data.value.length === 2){
					this.showPicker = bool
					if(data.value.length !== 0){
						this.projectName = "";
						let arr = data.value
						let newArr = arr.map(item=>item.name)
						let siteId = arr[1].id || ""
						newArr = [this.title, ...newArr]
						this.projectName = newArr.join(",")
						// 存储到vuex中
						this.getProjectName(this.projectName)
						this.getProjectSiteId(siteId)
						uni.navigateBack({
							url: `/subpackage-equipment/pages/device/deviceCome/deviceCome`
						})
					}
				}
			},
			
			cancel(bool){
				console.log(this.data1)
				this.showPicker = bool
			},
			
			// 获取项目数据
			getTreeByNameByLike(){
				getTreeByNameByLike({}).then(res=>{
					console.log(res)
					this.projectList = res.result
				})
			},
			
			goBack(url){
				uni.navigateBack({
					url: url
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.selectProject{
		/* #ifdef MP-WEIXIN */
			padding-top: 200rpx;
		/* #endif */
		.scroll-box{
			max-height: calc(100vh - 170rpx);
			padding-top: 10rpx;
		}
		.content{
			// padding-top: 30rpx;
			padding-left: 30rpx;
			padding-right: 30rpx;
			.item{
				display: flex;
				align-items: center;
				padding: 0rpx 20rpx;
				height: 110rpx;
				line-height: 110rpx;
				font-size: 32rpx;
				font-family: PingFang SC-Bold, PingFang SC;
				font-weight: bold;
				color: #445469;
				border-bottom: 2rpx solid #E2E5ED;
				.name{
					flex: 1;
				}
			}
		}
	}
</style>
